<template>
  <div>
    <!-- 登录页 2018/7/20 zhangQ -->
    <div class="login-top">
      <div class="circle">联运e达</div>
    </div>
    <div class="login-center">
      <img :src="logincenter1" style="width: 100%">
    </div>
    <mu-form ref="userFormRef" :model="userForm" class="userForm">
      <mu-form-item label="用户名">
        <mu-text-field v-model="userForm.userName" placeholder="请输入登录名/手机号/邮箱"></mu-text-field>
      </mu-form-item>
      <mu-form-item label="密码">
        <mu-text-field type="password" v-model="userForm.password" placeholder="请输入密码"></mu-text-field>
      </mu-form-item>
      <mu-button full-width round color="primary" @click="loginSubmit">登录</mu-button>
    </mu-form>
  </div>
</template>

<script>
  import logincenter1 from '../../../static/img/logincenter1.png'
  import { appLogin } from '@/api/common'

  export default {
    name: 'login',
    data () {
      let userForm = {
        userName: '',
        password: ''
      }
      let datas = { userForm, logincenter1 }
      return datas
    },
    computed: {},
    methods: {
      loginSubmit () {
        appLogin({ username: this.userForm.userName, password: this.userForm.password })
          .then(res => {
            let resData = res.data
            if (+resData.isSuccess !== 1) {
              this.$toast.error(resData.res)
              return
            }
            this.$toast.success('登陆成功')
            let userInfo = resData.data.userInfo
            let roles = resData.data.roles
            let powers = resData.data.powers
            let token = resData.data.token
            let conf = resData.data.conf
            let permissions = []
            powers['1'] && (permissions = powers['1'])
            powers['2'] && (permissions = permissions.concat(powers['2']))
            powers['3'] && (permissions = permissions.concat(powers['3']))
            powers['4'] && (permissions = permissions.concat(powers['4']))
            let currentUser = userInfo
            currentUser.roles = roles
            // currentUser.conf = { positionTrack: 11 }
            currentUser.powers = permissions
            currentUser.appPower = powers['3']
            currentUser.elementPower = powers['4']
            currentUser.conf = conf
            // $api.setStorage('currentUser', JSON.stringify(currentUser))
            // $api.setStorage('token', token)
            localStorage.setItem('currentUser', JSON.stringify(currentUser))
            localStorage.setItem('token', token)
            this.$router.push({ name: 'index' })
          })
      }
    },
    created () {
    },
    mounted () {
    },
    components: {}
  }
</script>

<style scoped>
  .login-top {
    background: #4585f5;
    height: 41.7%;
    width: 100%;
  }

  .userForm {
    background-color: #ffffff;
    padding: 20px 11%;
  }

  .circle {
    margin: auto;
    position: absolute;
    width: 108px;
    height: 108px;
    text-align: center;
    padding-top: 40px;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: #ffffff;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    font-family: hzgb;
    font-size: 20px;
    color: #4585F5;
    font-weight: 900;
  }
</style>
